<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>

<body>
    <input type="text">
    <button class="add-btn">发表留言</button>
    <ul class="cmt">
        <li>12</li>
        <li>12</li>
        <li>12</li>
    </ul>
    <script>
        let txt = document.querySelector('input')
        let btn = document.querySelector('.add-btn')
        let cmt = document.querySelector('.cmt')
        txt.onfocus = function () {
            txt.value = ''
        }
        btn.onclick = function () {
            let li = document.createElement('li')
            li.innerText = txt.value || '此人很懒什么都没有留下'
            cmt.insertBefore(li, cmt.firstElementChild)
            cmt.children.length > 5 ? cmt.removeChild(cmt.lastElementChild) : null
        }
        let hasChildren = function (currentEle) {
            return Array.from(currentEle.childNodes).filter(element => element.nodeType===1)
        }
        console.log(cmt.childNodes)
        console.log(hasChildren(cmt))
    </script>

</body>

</html>